import { ElementDSL } from '../ElementDSL'
import type { SizeType, ButtonType, ComponentConfig } from '../DslType'
import { ElButton } from 'element-plus'
//按钮
export default class Button extends ElementDSL {
  constructor() {
    super(ElButton)
  }

  size(value: SizeType): this {
    return super.setProps('size', value)
  }
  type(value: ButtonType): this {
    return super.setProps('type', value)
  }
  plain(value: boolean): this {
    return super.setProps('plain', value)
  }
  text(value: boolean): this {
    return super.setProps('text', value)
  }
  bg(value: boolean): this {
    return super.setProps('bg', value)
  }
  link(value: boolean): this {
    return super.setProps('link', value)
  }
  round(value: boolean): this {
    return super.setProps('round', value)
  }
  circle(value: boolean): this {
    return super.setProps('circle', value)
  }
  loadingIcon(value: string | ComponentConfig): this {
    return super.setProps('loading-icon', value)
  }
  loading(value: string): this {
    return super.setProps('loading', value)
  }
  disabled(value: boolean): this {
    return super.setProps('disabled', value)
  }

  icon(value: string): this {
    return super.setProps('icon', value)
  }

  autofocus(value: boolean): this {
    return super.setProps('autofocus', value)
  }

  nativeType(value: string): this {
    return super.setProps('nativeType', value)
  }

  autoInsertSpace(value: boolean): this {
    return super.setProps('autoInsertSpace', value)
  }
  /**自定义按钮颜色, 并自动计算 hover 和 active 触发后的颜色 */
  color(value: string): this {
    return super.setProps('color', value)
  }
  /**dark 模式, 意味着自动设置 color 为 dark 模式的颜色 */
  dark(value: boolean): this {
    return super.setProps('dark', value)
  }
  /**
   * 自定义元素标签
   * string/Component
   * button
   * */
  tag(value: string | ComponentConfig): this {
    return super.setProps('tag', value)
  }
  // 插槽
  slot(name: 'default' | 'loading' | 'icon', content: string): this {
    return super.setSlot(name, content)
  }
}
